﻿$(function () {
    $(document).ready(function () {
        var containerHeight = $('.add-image-popup').outerHeight();
        var popupTopPosition = '-' + containerHeight;
        $('.add-image-popup').css({ 'top': popupTopPosition + 'px' });
        var borderTop = parseInt(($('.grab-add-popup').css('border-top-width')), 10);
        var borderBot = parseInt(($('.grab-add-popup').css('border-bottom-width')), 10);
        var grabAddImageTopValue = containerHeight - (borderTop + borderBot);
        $('.grab-add-popup').css('top', grabAddImageTopValue + 'px');
    });

    $('.grab-add-popup').click(function () {
        var addImagePopup = $(this).parent();
        var container = addImagePopup.parent();
        var containerOffsetTop = parseInt(container.offset().top, 10);
        var addImageOffsetTop = parseInt(addImagePopup.offset().top, 10);
        var topValue = '-' + addImagePopup.outerHeight();
        if (addImageOffsetTop < containerOffsetTop) {
            addImagePopup.animate({ top: '0' }, 'slow', function () {
                $(this).children('.grab-add-popup').children('div').addClass('up');
            });
        }
        else {
            addImagePopup.animate({ top: topValue }, 'slow', function () {
                $(this).children('.grab-add-popup').children('div').removeClass('up');
            });
        }
    });
});